<template>
  <!-- excel -->
  <div class="show-module">
    <div class="show-module-hd drag-tongs">
      {{ data.title || '测试测试' }}
    </div>
    <div class="show-module-centent">
      <div :id="id"></div>
    </div>
  </div>
</template>
<script>
  import Handsontable from 'handsontable';

  export default {
    props: {
      id: {
        type: [String, Number],
        default: 'excelModule',
      },
      type: {
        type: String,
      },

      // 图表显示数据
      data: {
        type: Object,
        default() {
          return {};
        },
      },
    },
    mounted() {
      setTimeout(() => {
        this.init();
      }, 10);
    },
    methods: {
      init() {
        new Handsontable(document.getElementById(this.id), {
          data: [],
          colWidths: 100,
          width: '100%',
          height: '100%',
          rowHeaders: true,
          colHeaders: true,
          manualColumnResize: true, //允许拖曳列表头，默认为false
          manualRowResize: true, //允许拖曳行表头，默认为false
          contextMenu: true,
          copyable: true,

          afterChange: function (changes, source) {},
        });
      },
    },
  };
</script>
